<template>
  <a-switch v-bind="$attrs" :checked="fakeValue" @change="onChange" />
</template>
<script>
export default {
  name: 'SSwitch',
  props: {
    modelValue: {
      type: [String, Number, Boolean],
      required: false
    },
    checkValue: {
      type: [String, Number, Boolean],
      required: false,
      default: true
    },
    unCheckValue: {
      type: [String, Number, Boolean],
      required: false,
      default: false
    }
  },
  emits: ['change', 'update:modelValue'],
  data() {
    return { fakeValue: this.modelValue === this.checkValue }
  },
  watch: {
    modelValue(val) {
      if (val === this.checkValue) {
        this.fakeValue = true
      } else {
        this.fakeValue = false
        if (val == undefined) {
          this.$emit('update:modelValue', this.unCheckValue)
        }
      }
    }
  },
  created() {
    if (this.modelValue == undefined) {
      this.$emit('update:modelValue', this.unCheckValue)
    }
  },

  methods: {
    onChange(val) {
      this.$emit('update:modelValue', val == this.checkValue ? this.checkValue : this.unCheckValue)
      this.$emit('change', val == this.checkValue ? this.checkValue : this.unCheckValue)
    }
  }
}
</script>
